<script setup>
import { ref, toRef, toRefs, reactive ,onMounted} from "vue";
import { useRoute, useRouter } from "vue-router";
import { GetTabDataapi } from "../../http/api";
import ItemBox from '../../components/Home/ItemBox.vue'
const router = useRouter();
const route = useRoute();
const title = route.query.key;
const key = ref("");
const List=ref([])
console.log(title);
const onSearch = () => {
    GetTabDataapi({id:localStorage.getItem('tabid'),title:key.value,}).then((res) => {
    console.log(res);
    List.value=res.data.data
  });
};
const onCancel = () => {};
const getdata = () => {
    
  GetTabDataapi({title,id:localStorage.getItem('tabid')}).then((res) => {
    console.log(res);
    List.value=res.data.data
  });
};
onMounted(() => {
  getdata();
  key.value=title
});

</script>
<template>
  <div>
    <div class="_search_head_main">
      <div class="search_head_back">
        <van-icon name="arrow-left" size="25" @click="router.go(-1)" />
      </div>
      <van-search
        v-model="key"
        show-action
        placeholder="请输入搜索关键词"
        @search="onSearch"
        @cancel="onCancel"
      />
    </div>
    <item-box :data="List"></item-box>
  </div>
</template>
<style scoped>
._search_head_main {
  width: 100%;
  height: 80px;
  display: flex;
  background-color: white;
}
.search_head_back {
  width: 15%;
  height: 80px;
  text-align: center;
  line-height: 80px;
}
.van-search {
  width: 85%;
}
</style>
